<#include "/admin/common/page.ftl"/>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <link rel="icon" href="${una}/img/favicon.png" type="image/x-icon">
    <link rel="shortcut icon" href="${una}/img/favicon.png" type="image/x-icon">
    <link rel="stylesheet" href="${una}/css/bootstrap.css" />
    <link rel="stylesheet" href="${una}/css/font-awesome.css" />
    <link rel="stylesheet" href="${una}/css/ionicons.css" />
    <link rel="stylesheet" href="${una}/js/layer/theme/default/layer.css"/>
    <link rel="stylesheet" href="${una}/js/zTree_v3/css/zTreeStyle/zTreeStyle.css" />
    <link rel="stylesheet" href="${una}/css/blog-boot.css" />
    <title>主题 - 尤娜(UnaBoot)</title>
    <style>
        .layui-layer-btn .layui-layer-btn0{
            border-color: none;
            color:#fff !important;
        }
    </style>
</head>
<body>
<div class="header fixed-top">
    <div class="container">
        <div class="left">
            <a href="${una}/admin/dashboard" class="logo"><img src="${blog_logo!'${una}/img/logo.png'}" class="img-fluid" style="height: 40px"></a>
        </div>
        <div class="middle">
            <div class="inner">
                <a href="${una}/admin/dashboard"><i class="fa fa-dashboard"></i> 主页</a>
                <a href="${una}/admin/posts" ><i class="fa fa-edit"></i> 创作</a>
                <a href="${una}/admin/categories"><i class="fa fa-th-large"></i> 页面</a>
                <a href="${una}/admin/themes" class="current"><i class="fa fa-gift"></i> 主题</a>
                <a href="${una}/admin/settings/general"><i class="fa fa-sliders"></i> 系统</a>
            </div>
        </div>
        <div class="right">
            <a href="/admin/logout" data-toggle="tooltip" data-placement="bottom" title="退出"><i class="fa fa-sign-out"></i></a>
            <a href="javascript:void(0);" id="profile" data-toggle="tooltip" data-placement="bottom" title="个人设置"><i class="fa fa-cogs"></i></a>
            <a href="${una}/index.html" data-toggle="tooltip" data-placement="bottom" title="博客主页"><i class="fa fa-home"></i></a>
        </div>
    </div>
</div>
<div class="wrapper">
    <div class="container">
        <div class="box box-solid">
            <div class="box-header with-border">
                <p class="box-title"><i class="fa fa-image"></i> 主题列表</p>
            </div>
            <div class="box-body">
                <div class="row">
                    <#if themes?? && themes.content?size gt 0>
                        <#list themes.content as theme>
                            <div class="col-3 mb-4">
                                <div class="theme-item card">
                                    <div class="theme-preview card-body p-1">
                                        <a href="${una}/admin/themes/folders?path=${theme.name}"><img src="${una}/${theme.thumb}" height="148" class="card-img-top"></a>
                                    </div>
                                    <div class="card-footer">
                                        <a class="card-name" href="${una}/admin/themes/folders?path=${theme.name}">${theme.name}</a>
                                        <#if theme.status == 1>
                                            <a href="javascript:void(0);" class="card-name refresh-theme" data-theme="${theme.name}"><i class="fa fa-refresh font-16 pull-right text-success"></i></a>
                                        <#else>
                                            <a href="javascript:void(0)" class="card-name open-theme" data-theme="${theme.name}"><i class="fa fa-circle font-16 pull-right"> 开启</i></a>
                                            <a href="#" class="card-name"><i class="fa fa-trash-o text-danger font-16 pull-right"> 卸载</i></a>
                                        </#if>

                                    </div>
                                </div>
                            </div>
                        </#list>
                    </#if>
                </div>
            </div>
            <div class="box-footer">
                <button class="btn btn-outline-primary" id="upload-theme"><i class="fa fa-cloud-upload"></i> 上传主题</button>
                <nav aria-label="..." class="pull-right">
                    <#if themes?? && themes.content?size gt 0>
                        <@paging una+"/admin/themes" themes 9 />
                    </#if>
                </nav>
            </div>
        </div>
    </div>
</div>
<div class="footer">

</div>
</body>

<script type="text/javascript" src="${una}/js/jquery.min.js" ></script>
<script type="text/javascript" src="${una}/js/jquery.serializejson.js"></script>
<script type="text/javascript" src="${una}/js/bootstrap.min.js" ></script>
<script type="text/javascript" src="${una}/js/bootstrap.bundle.js" ></script>
<script type="text/javascript" src="${una}/js/layer/layer.js"></script>
<script type="text/javascript" src="${una}/js/blog-boot.js"></script>
<script>
    $(function(){
        $("#upload-theme").on("click",function(){
            layer.open({
                type:2,
                title:"<i class='fa fa-cogs'> 安装新主题</i>",
                shadeClose:false,
                shade:0.5,
                offset:["100px"],
                area:['500px','400px'],
                content:"${una}/admin/themes/install",
                resize:false,
                anim:2,
                end:function(){
                    location.reload();
                }
            });
        });
        $(".open-theme").on("click",function(){
            var theme = $(this).attr("data-theme");
            layer.confirm("你确认启用该主题吗?",{title:'系统提示'},function(){
                $.ajax({
                    type:'POST',
                    url:'${una}/admin/themes/active/'+theme,
                    success:function(){
                        layer.alert(theme+"已经设置为网站主题",{title:'系统提示',icon: 1},function(){
                            window.location.reload();
                        });
                    },
                    error:function(){
                        layer.alert("设置主题失败",{title:'系统提示',icon:3},function (index) {
                            layer.close(index);
                        })
                    }
                })
            });
        });
        $(".refresh-theme").on("click",function(){
           var theme = $(this).attr("data-theme");
           layer.confirm("你确定刷新主题文件吗?",{title:'系统提示'},function(){
              $.ajax({
                  type:'POST',
                  url:'${una}/admin/themes/refresh/'+theme,
                  success:function(){
                      layer.alert(theme+"主题的文件已经刷新",{title:'系统提示',icon:1},function (index) {
                          layer.close(index);
                      });
                  },
                  error:function(){
                      layer.alert("刷新失败",{title:'系统提示',icon:3},function(index){
                         layer.close(index);
                      });
                  }
              })
           });
        });
        $("#profile").on("click",function(){
            layer.open({
                type:2,
                title:"<i class='fa fa-users'> 重置管理员密码</i>",
                shadeClose:false,
                shade:0.5,
                area:['400px','350px'],
                offset:['150px'],
                content:"${una}/admin/user/profile",
                resize:false,
                anim:2,
            });
        });
    });
</script>
</html>
